<template>
    <div>
        <Breadcrumb>
            <Breadcrumb-item href="/">
                <Icon type="ios-home-outline"></Icon> 配置管理
            </Breadcrumb-item>
            <Breadcrumb-item href="">
                <Icon type="social-buffer-outline"></Icon> 网站配置
            </Breadcrumb-item>
            <Breadcrumb-item>
                <Icon type="pound"></Icon> 用户端配置
            </Breadcrumb-item>
        </Breadcrumb>
        <Form ref="formValidate" :label-width="120" style="margin-top: 20px;">
            <!-- <FormItem label="陪驾轮播图" prop="operator_id">
                <MyUpload :maxNumber="5" @getImages="getImg11" :defaultImags="configInfo.partner_drive_banner_list">
                </MyUpload>
            </FormItem> -->
            <!-- <FormItem label="验车价格(%)" class="item">
                <Input v-model="configInfo.invoice_ratio" type="number" style="width: 300px;"></Input>发票金额的百分比作为验车金额
            </FormItem> -->
            <FormItem label="分享佣金(%)" class="item">
                <Input v-model="configInfo.share_ratio" type="number" style="width: 300px;"></Input>分享下级可得订单金额的百分比
            </FormItem>
            <FormItem label="财务电话" class="item">
                <Input v-model="configInfo.fianace_tel" type="number" style="width: 300px;"></Input>
            </FormItem>
            <FormItem label="平台比例(%)" class="item">
                <Input v-model="configInfo.platform_ratio" type="number" style="width: 300px;"></Input>学车订单平台抽成百分比
            </FormItem>
            <FormItem label="教练保证金" class="item">
                <Input v-model="configInfo.earnest_money" type="number" style="width: 300px;"></Input>
            </FormItem>
            <FormItem label="客服电话" class="item">
                <Input v-model="configInfo.service_tel" type="text" style="width: 300px;"></Input>
            </FormItem>
            <FormItem label="陪驾默认图" class="item">
                <MyUpload :maxNumber="1" @getImages="getImg1" :defaultImags="[configInfo.verify_img]"></MyUpload>
            </FormItem>
            <!-- <FormItem label="验车默认图" class="item">
                <MyUpload :maxNumber="1" @getImages="getImg" :defaultImags="[configInfo.goods_img]"></MyUpload>
            </FormItem> -->
            <FormItem label="验车说明图" class="item">
                <MyUpload :maxNumber="1" @getImages="getImg2" :defaultImags="[configInfo.verify_car_intro_img]"></MyUpload>
            </FormItem>
            <FormItem label="上课时间" class="item">
                <Input v-model="configInfo.work_time_start" type="number" style="width: 100px;"></Input> -
                <Input v-model="configInfo.work_time_end" type="number" style="width: 100px;"></Input>
            </FormItem>
            <FormItem label="最低转化率(%)" class="item">
                <Input v-model="configInfo.min_ratio" type="number" style="width: 300px;"></Input>
            </FormItem>
            <FormItem label="温馨提示" class="item">
                <Input v-model="configInfo.hint" type="text"></Input>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="handleSubmit('formValidate')">保存</Button>
            </FormItem>
        </Form>
    </div>
</template>
<script>
import config from "@/config";
import { getToken } from "../../libs/util";
const baseUrl = process.env.NODE_ENV === "development" ? config.baseUrl.dev : config.baseUrl.pro;
const baseImgeUrl = process.env.NODE_ENV === "development" ? config.baseImgUrl.dev : config.baseImgUrl.pro;
import MyUpload from "_c/my-upload"
export default {
    name: "configUser",
    components: {
        MyUpload
    },
    data() {
        return {
            //运营商列表
            action_url: baseUrl + "/admin/file/upload",
            baseImgeUrl: baseImgeUrl,
            imgUrl: "",
            visible: false,
            header: { Authorization: getToken() },
            configInfo: {
                video2: "",
                video1: "",
                banner_list: [],
                traffic_type0: {
                    start_step: "",
                    avg: "",
                    start: "",
                },
                traffic_type1: {
                    start_step: "",
                    avg: "",
                    start: "",
                },
                withdraw_config: {
                    min: "",
                    rate: "",
                },
                newcomer_coupons: false,
                inviting_coupons: false,
            }
        }
    },
    methods: {
        getImg(items) {
            items.forEach(item => {
                this.configInfo.goods_img = item.url;
            });
        },
        getImg1(items) {
            items.forEach(item => {
                this.configInfo.verify_img = item.url;
            });
        },
        getImg11(items) {
            items.forEach(item => {
                this.configInfo.partner_drive_banner_list.push(item.url);
            });
        },
        getImg2(items) {
            items.forEach(item => {
                this.configInfo.verify_car_intro_img = item.url;
            });
        },
        newUserChange(status) {
            this.configInfo.newcomer_coupons = status;
        },
        inviteChange(status) {
            this.configInfo.inviting_coupons = status;
        },
        getConfigInfo() {
            this.$axios('/admin/config/getConfigInfo', { type: 1 }).then(res => {
                this.configInfo = res;
                this.configInfo.newcomer_coupons = this.configInfo.newcomer_coupons == 1 ? true : false;
                this.configInfo.inviting_coupons = this.configInfo.inviting_coupons == 1 ? true : false;
            });
        },
        handleSubmit() {
            let param = { ...this.configInfo };
            param.newcomer_coupons = param.newcomer_coupons ? 1 : 0;
            param.inviting_coupons = param.inviting_coupons ? 1 : 0;
            this.$axios('/admin/config/setConfig', param).then(res => {
                this.$Message.success('保存成功');
                this.getConfigInfo();
            })
        },
        //图片类型错误
        handleFormatError(file) {
            this.$Notice.warning({
                title: "文件格式错误",
                desc: "不支持该文件类型",
            });
        },
        //下单须知
        handleSuccessLogo(res, file) {
            let src = res.data.src;
            this.configInfo.pay_img = src;
        },
        handleSuccessLogo1(res, file) {
            let src = res.data.src;
            this.$set(this.configInfo, 'auth_template', src);
            // this.configInfo.video1 = src;
        },
        handleSuccessLogo2(res, file) {
            let src = res.data.src;
            this.$set(this.configInfo, 'video2', src);
        },
        //banner图或视频
        handleSuccessBanner(res, file) {
            let src = res.data.src;
            let ext = res.data.ext;
            this.configInfo.banner_list.push(src);
        },
        handleView(src) {
            this.visible = true;
            this.imgUrl = src;
        },
        handleRemove(index) {
            this.configInfo.banner_list.splice(index, 1);
        },
    },
    created() {
        this.getConfigInfo();
    },
}

</script>
<style>
.demo-upload-list {
    display: inline-block;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    border: 1px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
    margin-right: 4px;
}

.demo-upload-list img {
    width: 100%;
    height: 100%;
}

.demo-upload-list-cover {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, .6);
}

.demo-upload-list:hover .demo-upload-list-cover {
    display: block;
}

.demo-upload-list-cover i {
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
}
</style>
<style src="@wangeditor/editor/dist/css/style.css"></style>